<style>
    body {
        font-family: Arial, sans-serif;
        background-color: #121212;
        color: #e0e0e0;
        margin: 0;
        padding: 20px;
        width: 800px;
        font-size: 24px;
    }

    .flex-container,
    .furniture-container {
        display: flex;
        justify-content: space-between;
        max-width: 800px;
        margin: auto;
    }

    .container {
        background: #1e1e1e;
        padding: 20px;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
        width: 48%;
        margin: 10px 0;
    }

    h1 {
        text-align: center;
        color: #4CAF50;
        font-size: 30px;
        margin: 10px 0;
    }

    p,
    a {
        line-height: 1.6;
        font-size: 22px;
        margin: 5px 0;
        color: #4CAF50;
        text-decoration: none;
    }

    .furniture-item {
        position: relative;
        width: 24%;
        margin-bottom: 20px;
        text-align: center;
    }

    .furniture-item img {
        width: 100%;
        border-radius: 8px;
        background-color: #ccc;
        display: block;
    }

    .furniture-price {
        position: absolute;
        bottom: 10px;
        right: 10px;
        background-color: rgba(0, 0, 0, 0.7);
        color: #fff;
        padding: 5px;
        border-radius: 5px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>

<body>
    <div class="flex-container">
        <div class="container">
            <h1>光遇季节剩余信息</h1>
            <div id="season-info"></div>
        </div>
        <div class="container">
            <h1>光遇活动剩余信息</h1>
            <div id="activity-info"></div>
        </div>
    </div>
    <div class="container" style="width: 100%;">
        <h1>本周家具商店可售家具</h1>
        <div id="furniture-refresh-time"></div>
        <div id="furniture-week-info"></div>
        <div class="furniture-container" id="furniture-info">
        </div>
    </div>

    <script>
        const image = 'https://gitee.com/Tloml-Starry/resources/raw/master/resources/img/%E5%85%89%E9%81%87/AncestorDressUp/Props/';
        const currencyIcons = {
            1: `<mat-icon role="img" class="mat-icon notranslate mat-icon-no-color" aria-hidden="true" data-mat-icon-type="svg" data-mat-icon-name="candle" style="width: 24px; height: 24px; vertical-align: top;">
                        <svg viewBox="0 0 300 300" fit="" height="100%" width="100%" preserveAspectRatio="xMidYMid meet" focusable="false">
                            <path fill="rgb(221, 221, 221)" d="M 120.5,270.37631 C 106.13946,268.69198 97.386844,266.22075 90.081499,261.78791 80.205463,255.7952 80.590573,257.28941 79.87295,222.17903 79.528072,205.30556 78.958924,189.25 78.608176,186.5 78.257428,183.75 77.535605,167.79625 77.004124,151.04722 76.472644,134.29819 75.307902,113.78047 74.415809,105.45228 72.483555,87.413618 73.251287,81.451427 78.371933,74.729097 84.871113,66.197042 94.077339,63.135901 115.75,62.300604 L 131,61.712845 V 48.034561 c 0,-16.305565 1.47967,-22.13649 6.37489,-25.121471 5.61845,-3.425991 10.65579,-2.13244 12.51993,3.215024 0.60785,1.743683 1.10518,9.573082 1.10518,17.398665 0,11.826071 0.27029,14.452655 1.60091,15.556972 1.03298,0.857292 8.90504,1.959415 22.18984,3.106673 23.6378,2.04133 30.18343,3.583756 34.80002,8.200348 5.53852,5.538518 5.80917,8.220618 4.55201,45.109228 -0.61855,18.15 -1.59068,51.225 -2.16029,73.5 -1.68697,65.97002 -1.30846,60.10258 -4.26705,66.1449 -3.25131,6.64014 -8.00613,9.90886 -18.51891,12.73091 -15.89725,4.26745 -44.69467,5.31565 -68.69653,2.5005 z M 153.01155,196.25 c 3.93595,-2.28267 10.79008,-8.05418 17.5168,-14.75 13.37165,-13.31022 17.50437,-20.22507 18.24102,-30.52079 1.03974,-14.5317 -6.39421,-24.1634 -20.89797,-27.07617 -8.96987,-1.80141 -14.83949,0.75865 -21.5673,9.40664 l -2.18582,2.80967 -5.57937,-4.54445 C 131.25148,125.6392 127.93817,124 123.2278,124 c -10.23621,0 -18.14947,5.91689 -22.22651,16.61917 -2.965743,7.78512 -2.824923,13.1771 0.52285,20.01969 7.47958,15.28771 33.43154,39.31803 42.49861,39.35176 1.38752,0.005 5.43247,-1.67812 8.9888,-3.74062 z"></path>
                        </svg>
                    </mat-icon>`,
            2: `<mat-icon role="img" class="mat-icon notranslate mat-icon-no-color" aria-hidden="true" data-mat-icon-type="svg" data-mat-icon-name="heart" style="width: 24px; height: 24px; vertical-align: top;">
                        <svg viewBox="0 0 300 300" fit="" height="100%" width="100%" preserveAspectRatio="xMidYMid meet" focusable="false">
                            <path fill="rgb(221, 221, 221)" d="M 142.60959,239.44301 C 113.95321,222.16358 85.878166,200.14007 65.960999,179.31593 34.762678,146.69692 25.58634,117.48388 38.520684,91.959182 44.836353,79.49581 59.46944,65.48697 70.949494,60.913786 78.618407,57.858805 93.1368,57.186091 101.94215,59.477733 c 13.29152,3.459193 26.87142,11.182516 40.38467,22.968066 l 7.75335,6.762057 8.70991,-8.364533 c 24.65648,-23.678741 50.65888,-30.815814 72.23571,-19.827073 11.53148,5.872805 25.70955,20.774076 31.15572,32.744938 10.07795,22.151642 2.90076,46.630652 -22.5704,76.980142 -16.43339,19.58077 -46.61543,44.60439 -77.99281,64.66304 -6.53493,4.1776 -12.15993,7.59447 -12.5,7.59306 -0.34006,-0.001 -3.26898,-1.6009 -6.50871,-3.55442 z"></path>
                        </svg>
                    </mat-icon>`,
            3: `<mat-icon role="img" class="mat-icon notranslate mat-icon-no-color" aria-hidden="true" data-mat-icon-type="svg" data-mat-icon-name="ascended-candle" style="width: 24px; height: 24px; vertical-align: top;">
                        <svg viewBox="0 0 300 300" fit="" height="100%" width="100%" preserveAspectRatio="xMidYMid meet" focusable="false">
                            <defs>
                                <radialGradient id="ac-gradient" gradientUnits="userSpaceOnUse" cx="48%" cy="52%" r="100">
                                    <stop offset="35%" stop-color="#9D3752"></stop>
                                    <stop offset="100%" stop-color="#FFDCCF"></stop>
                                </radialGradient>
                            </defs>
                            <path style="fill:url('#ac-gradient');stroke: #9D3752;stroke-width: 2px;" d="M 132.19253,271.95392 C 109.84932,270.24014 97.72766,267.24222 88.061479,261.03945 79.819795,255.75078 79.721195,255.29293 78.900339,218.5 77.899922,173.6587 76.263326,133.04076 74.770363,116 74.071664,108.025 73.511182,97.225 73.524849,92 c 0.02912,-11.133955 1.803503,-15.557322 8.560808,-21.341324 6.489118,-5.554444 13.995804,-7.609561 32.485773,-8.893684 l 16.07144,-1.116157 -0.0714,-12.574417 c -0.0841,-14.798712 1.33242,-20.974279 5.64275,-24.601186 3.5813,-3.013464 9.66455,-3.369707 12.07419,-0.70708 2.74694,3.035331 3.82011,10.744087 3.148,22.612567 -0.85742,15.14074 -1.25595,14.726189 15.17162,15.78167 28.83453,1.852636 37.83926,3.715032 43.17231,8.929073 6.13884,6.001848 5.98043,1.253327 3.21615,96.410538 -0.51128,17.6 -1.20867,42.8 -1.54977,56 -0.72442,28.03361 -1.61228,32.6656 -7.36387,38.41719 -4.41499,4.41499 -11.90372,7.24094 -25.08281,9.46527 -11.35149,1.91586 -32.88987,2.63897 -46.80747,1.57146 z"></path>
                            <path style="fill:#fff" d="m 140.78738,211.25 c -0.97969,-1.12602 -1.72812,-4.78076 -2.09902,-10.25 -1.18159,-17.42369 -7.36292,-29.73213 -17.40411,-34.65552 C 116.1549,163.82946 114.19795,163.46824 104,163.15414 92.035288,162.78563 89,161.74267 89,158 c 0,-3.26299 3.252468,-4.73243 11.95614,-5.4017 15.31156,-1.17738 25.88251,-4.55111 30.81059,-9.83324 3.93609,-4.21887 6.41475,-13.19983 6.97291,-25.26506 0.54544,-11.79016 1.62804,-14.5 5.7929,-14.5 1.22242,0 2.67423,0.5625 3.22626,1.25 0.55203,0.6875 1.22744,6.2 1.50091,12.25 0.6374,14.10138 3.33173,22.01489 9.74029,28.60813 6.23844,6.41821 13.37124,8.96103 27.39521,9.76627 8.84755,0.50802 11.10188,0.9545 11.99488,2.3756 0.79965,1.27254 0.79946,2.22746 -7.1e-4,3.5 -0.85493,1.35965 -3.19591,1.92163 -10.49488,2.51944 -16.11782,1.32011 -25.11446,4.76537 -31.55735,12.08487 -5.01982,5.70283 -7.4862,13.50763 -8.10421,25.64569 -0.26604,5.225 -0.93238,10.0625 -1.48076,10.75 -1.41826,1.77804 -4.18453,1.54616 -5.9648,-0.5 z"></path>
                        </svg>
                    </mat-icon>`
        };

        function Cttrt(timestamp) {
            return {
                days: Math.floor(timestamp / (24 * 60 * 60 * 1000)),
                hours: Math.floor((timestamp % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000)),
                minutes: Math.floor((timestamp % (60 * 60 * 1000)) / (60 * 1000)),
                seconds: Math.floor((timestamp % (60 * 1000)) / 1000)
            };
        }

        function createInfoElement(data, container) {
            data.forEach(item => {
                const p = document.createElement('p');
                p.innerHTML = item;
                container.appendChild(p);
            });
        }

        function getNextWednesday() {
            const now = new Date();
            const dayOfWeek = now.getDay();
            const daysUntilWednesday = (3 - dayOfWeek + 7) % 7;
            const nextWednesday = new Date(now);
            nextWednesday.setDate(now.getDate() + daysUntilWednesday);
            nextWednesday.setHours(23, 59, 59, 999);
            return nextWednesday;
        }

        function updateFurnitureRefreshTime() {
            const refreshTimeDiv = document.getElementById('furniture-refresh-time');
            const nextWednesday = getNextWednesday();
            const currentTimestamp = Date.now();
            const remainingTime = nextWednesday.getTime() - currentTimestamp;
            const { days, hours, minutes, seconds } = Cttrt(remainingTime);

            refreshTimeDiv.innerHTML = `距离下次刷新还剩: <span style="color: #4CAF50;">${days}</span>天<span style="color: #4CAF50;">${hours}</span>时<span style="color: #4CAF50;">${minutes}</span>分<span style="color: #4CAF50;">${seconds}</span>秒`;
        }

        function getCurrentWeek() {
            const options = { timeZone: 'Asia/Shanghai' };

            const startDate = new Date('2025-01-29T00:00:00+08:00');

            const currentDate = new Date(new Date().toLocaleString('en-US', options));

            if (currentDate < startDate) {
                return 1;
            }

            let thursdays = 0;
            const tempDate = new Date(startDate);

            while (tempDate <= currentDate) {
                if (tempDate.getDay() === 4 && tempDate >= startDate) {
                    thursdays++;
                }
                tempDate.setDate(tempDate.getDate() + 1);
            }

            let number = 1;
            if (currentDate >= new Date('2025-01-30T00:00:00+08:00')) {
                number = thursdays + 1;
            }

            return ((number - 1) % 13) + 1;
        }

        async function fetchData() {
            const currentTimestamp = Date.now();
            const linkData = JSON.parse('{{@data}}');
            const { 季节: season, 活动: activity } = linkData;
            const currentWeek = getCurrentWeek() - 1;
            const furniture = [[
                { name: 'Stone Small Bench', type: 'LargeProps', price: 32, currencyType: 1 },
                { name: 'Stone Oven', type: 'LargeProps', price: 35, currencyType: 3 },
                { name: 'Stone Tall Cube', type: 'LargeProps', price: 88, currencyType: 1 },
                { name: 'Stone Single Bed', type: 'LargeProps', price: 24, currencyType: 2 }
            ], [
                { name: 'Stone Chair', type: 'LargeProps', price: 16, currencyType: 1 },
                //{ name: 'Stone Small Table', type: 'LargeProps', price: 20, currencyType: 1 },
                //{ name: 'Monotone Pillow', type: 'SmallProps', price: 32, currencyType: 1 },
                { name: 'Stone Tall Shelf', type: 'LargeProps', price: 15, currencyType: 3 }
            ], [
                { name: 'Stone Bench', type: 'LargeProps', price: 60, currencyType: 1 },
                { name: 'Stone Desk', type: 'LargeProps', price: 50, currencyType: 1 },
                { name: 'Two Colors Pillow', type: 'SmallProps', price: 12, currencyType: 2 },
                //{ name: 'Small Solid Rug', type: 'SmallProps', price: 25, currencyType: 1 }
            ], [
                { name: 'Stone Armchair', type: 'LargeProps', price: 10, currencyType: 2 },
                { name: 'Stone Console Table', type: 'LargeProps', price: 45, currencyType: 1 },
                { name: 'Decor Folded Cloth', type: 'SmallProps', price: 10, currencyType: 1 },
                { name: 'Small Striped Rug', type: 'SmallProps', price: 18, currencyType: 1 }
            ], [
                { name: 'Stone Loveseat', type: 'LargeProps', price: 33, currencyType: 2 },
                { name: 'Stone Round Dining Table', type: 'LargeProps', price: 18, currencyType: 2 },
                { name: 'Stone Plant Stand', type: 'LargeProps', price: 12, currencyType: 2 },
                { name: 'Small Classic Rug', type: 'SmallProps', price: 8, currencyType: 2 }
            ], [
                { name: 'Stone Corer Sofa', type: 'LargeProps', price: 25, currencyType: 1 },
                { name: 'Stone Square Dining Table', type: 'LargeProps', price: 23, currencyType: 2 },
                { name: '', type: '', price: 24, currencyType: 3 },
                { name: 'Small Half Circle Rug', type: 'SmallProps', price: 45, currencyType: 1 }
            ], [
                { name: 'Stone Sofa Side', type: 'LargeProps', price: 80, currencyType: 1 },
                { name: 'Stone Long Dining Table', type: 'LargeProps', price: 33, currencyType: 2 },
                { name: 'Stone Wall Sconce', type: 'SmallProps', price: 32, currencyType: 3 },
                { name: 'Medium Solid Rug', type: 'SmallProps', price: 40, currencyType: 1 }
            ], [
                { name: 'Stone Kitchen Drawers', type: 'LargeProps', price: 25, currencyType: 1 },
                { name: 'Stone Coffee Table', type: 'LargeProps', price: 28, currencyType: 3 },
                { name: 'Stone Candle Light', type: 'LargeProps', price: 16, currencyType: 3 },
                { name: 'Medium Striped Rug', type: 'SmallProps', price: 50, currencyType: 1 }
            ], [
                { name: 'Stone Wall Pot Rack', type: 'SmallProps', price: 25, currencyType: 1 },
                { name: 'Stone Closed Box', type: 'SmallProps', price: 10, currencyType: 1 },
                { name: 'Stone Washstand', type: 'LargeProps', price: 40, currencyType: 1 },
                { name: 'Medium Diamonds Rug', type: 'SmallProps', price: 18, currencyType: 2 }
            ], [
                { name: 'Stone Empty Box', type: 'SmallProps', price: 10, currencyType: 1 },
                { name: 'Stone Wall Mirror', type: 'SmallProps', price: 30, currencyType: 1 },
                { name: 'Medium Argyle Rug', type: 'SmallProps', price: 20, currencyType: 2 }
            ], [
                { name: 'Stone Wall Mug Rack', type: 'SmallProps', price: 20, currencyType: 1 },
                { name: 'Stone Wall Towel Rack', type: 'SmallProps', price: 15, currencyType: 1 },
                { name: 'Medium Circle Rug', type: 'SmallProps', price: 70, currencyType: 1 }
            ], [
                { name: 'Stone Kitchen Cabinet', type: 'LargeProps', price: 40, currencyType: 1 },
                { name: 'Stone Wall Shelf', type: 'SmallProps', price: 10, currencyType: 1 },
                { name: 'Large Solid Rug', type: 'SmallProps', price: 80, currencyType: 1 },
            ], [
                { name: 'Stone Kitchen Stove', type: 'LargeProps', price: 25, currencyType: 3 },
                { name: 'Stone Wide Cube', type: 'LargeProps', price: 10, currencyType: 1 },
                { name: 'Stone Large Bathtub', type: 'LargeProps', price: 45, currencyType: 2 },
                { name: 'Large Circle Rug', type: 'SmallProps', price: 90, currencyType: 1 }
            ]]

            if (currentWeek < 0) {
                console.error("当前周数超出家具数据范围");
                return;
            }

            displayFurniture(furniture[currentWeek]);
            const seasonInfoDiv = document.getElementById('season-info');
            const activityInfoDiv = document.getElementById('activity-info');
            const furnitureWeekInfoDiv = document.getElementById('furniture-week-info');

            const totalFurniturePriceByCurrency = furniture[currentWeek] ? furniture[currentWeek].reduce((acc, item) => {
                if (!acc[item.currencyType]) {
                    acc[item.currencyType] = 0;
                }
                acc[item.currencyType] += item.price;
                return acc;
            }, {}) : {};

            let priceDetails = '';
            for (const [currencyType, total] of Object.entries(totalFurniturePriceByCurrency)) {
                const currencyIcon = currencyIcons[currencyType] || '';
                priceDetails += `<span style="color: #FFD700;">${total}</span> <span style="vertical-align: middle; width: 1em; height: 1em; display: inline-block;">${currencyIcon}</span> `;
            }

            furnitureWeekInfoDiv.innerHTML = `当前为第 <span style="color: #FFD700;">${currentWeek + 1}</span> 轮，共 <span style="color: #FFD700;">13</span> 轮，本次家具总价格: ${priceDetails}`;

            const {
                name: seasonName,
                number: seasonNumber,
                startDate: seasonStartDate,
                endDate: seasonEndDate,
                ancestorsNumber
            } = season;

            const seasonStartTimestamp = new Date(seasonStartDate).getTime();
            const seasonEndTimestamp = new Date(seasonEndDate).getTime();
            const seasonRemainingTimestamp = seasonEndTimestamp - currentTimestamp;

            if (seasonRemainingTimestamp <= 0) {
                createInfoElement([`${seasonName}已结束 请等待下个季节到来`], seasonInfoDiv);
            } else {
                const { days, hours, minutes, seconds } = Cttrt(seasonRemainingTimestamp);
                const totalNumberOfDays = Math.floor((seasonEndTimestamp - seasonStartTimestamp) / 86400000) + 1;
                const { YesJKGetNumber, NoJKGetNumber } = {
                    YesJKGetNumber: (days + 1) * 6,
                    NoJKGetNumber: (days + 1) * 5
                };

                const { YesJKGraduationDays, NoJKGraduationDays } = {
                    YesJKGraduationDays: Math.ceil((seasonNumber - 30) / 6),
                    NoJKGraduationDays: Math.ceil((seasonNumber - ancestorsNumber * 3) / 5)
                };

                const data = [
                    `距离<strong style="color: #FFD700;">[${seasonName}]</strong>结束还剩`,
                    `<span style="color: #4CAF50;">${days}</span>天<span style="color: #4CAF50;">${hours}</span>时<span style="color: #4CAF50;">${minutes}</span>分<span style="color: #4CAF50;">${seconds}</span>秒`,
                    `截至至${seasonEndDate}`,
                    `本季节一共${totalNumberOfDays}天`,
                    '季蜡还可获得: ',
                    `[有季卡]: ${YesJKGetNumber}季蜡`,
                    `[无季卡]: ${NoJKGetNumber}季蜡`,
                    `本季节毕业需: ${seasonNumber}季蜡`,
                    `[有季卡]毕业需: ${YesJKGraduationDays}天`,
                    `[无季卡]毕业需: ${NoJKGraduationDays}天`,
                    '(无季卡包括非必要的魔法节点)'
                ];

                createInfoElement(data, seasonInfoDiv);
            }

            activity.forEach(activityData => {
                const {
                    name: activityName,
                    number: activityNumber,
                    DailyGetNumber: activityDailyGetNumber,
                    startDate: activityStartDate,
                    endDate: activityEndDate,
                    other: activityOther
                } = activityData;

                const activityStartTimestamp = new Date(activityStartDate).getTime();
                const activityEndTimestamp = new Date(activityEndDate).getTime();
                const activityRemainingTimestamp = activityEndTimestamp - currentTimestamp;

                if (activityRemainingTimestamp > 0) {
                    const { days, hours, minutes, seconds } = Cttrt(activityRemainingTimestamp);
                    const totalNumberOfDays = Math.floor((activityEndTimestamp - activityStartTimestamp) / 86400000) + 1;
                    const remainingObtainableQuantity = (days + 1) * activityDailyGetNumber;
                    const graduationDays = Math.ceil(activityNumber / activityDailyGetNumber);

                    const data = [
                        `距离<strong style="color: #FFD700;">[${activityName}]</strong>结束还剩`,
                        `<span style="color: #4CAF50;">${days}</span>天<span style="color: #4CAF50;">${hours}</span>时<span style="color: #4CAF50;">${minutes}</span>分<span style="color: #4CAF50;">${seconds}</span>秒`,
                        `截至至${activityEndDate}`,
                        `本活动一共${totalNumberOfDays}天`,
                        `代币物品总计需要: ${activityNumber}代币`,
                        `从今天至结束可获得代币: ${remainingObtainableQuantity}枚`,
                        `全部兑换需: ${graduationDays}天`,
                        `[备注] ${activityOther}`,
                    ];

                    createInfoElement(data, activityInfoDiv);
                }
            });
        }

        function displayFurniture(furniture) {
            const furnitureInfoDiv = document.getElementById('furniture-info');

            furniture.forEach(item => {
                const { name, type, price, currencyType } = item;
                const imgSrc = name ? `${image}${type}/${name}.png` : '';
                const currencyIcon = currencyIcons[currencyType] || '';

                const div = document.createElement('div');
                div.className = 'furniture-item';
                div.innerHTML = `
                    <img src="${imgSrc}" alt="Furniture Image" onerror="this.src='data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 200%22 preserveAspectRatio=%22xMidYMid slice%22><rect width=%22300%22 height=%22200%22 fill=%22%23cccccc%22></rect><text x=%22150%22 y=%22100%22 fill=%22%23999999%22 text-anchor=%22middle%22 dominant-baseline=%22middle%22>暂无图片</text></svg>'">
                    <div class="furniture-price">
                        ${price}
                        ${currencyIcon}
                    </div>
                `;
                furnitureInfoDiv.appendChild(div);
            });
        }

        fetchData(); // 调用异步函数
        updateFurnitureRefreshTime(); // 更新家具刷新时间
        setInterval(updateFurnitureRefreshTime, 1000); // 每秒更新一次
    </script>
</body>

</html>